<template>
	<div>
		<div class="tlt">
			<router-link to="" v-if="add" class="more">
				<svg><use xlink:href="#icon-paihangbang1"></use></svg>
				<p>排行榜</p>
				<svg class="more-ri"><use xlink:href="#icon-gengduo"></use></svg>
			</router-link>
			<router-link :to="{name:'channel', params:{id:tuid}}" v-else class="more more-d">
				<p>查看更多</p>
				<svg class="more-ri"><use xlink:href="#icon-gengduo"></use></svg>
			</router-link>
			<div v-if="add">
				热门推荐
			</div>
			<div v-else>{{txt}}</div>
			
		</div>
		<div class="clearfix">
			<comm v-for="(el,index) in dataArr" :key="index" :record="el"></comm>
		</div>
	</div>
</template>

<script>
	import CONFIG from "@/config";
	let partionList=CONFIG.partitionList;
	import axios from 'axios';
	import comm from './comm'
	export default {
	 	data(){
			return{
				list:4,
				dataArr:[],
				add:false,
				txt:"",
			}
		},
		props: ['tuid','ky','navs'],
		
		created(){
			this._getNews()
			this.atob()
		},
		mounted(){
		},
		components: {
			comm
		},
		watch:{
			'$route': ['atob','_getNews']
		},
		methods:{
			_getNews(){
				this.dataArr=[]
				var url = CONFIG.domain + "?rid="+this.tuid
				axios.get(url).then((res) => {
					this.dataArr=res.data.data.splice(0,4)
				})
	 		},
	 		atob(){
	 			if(this.ky==0){
	 				this.add=true
	 				return
	 			}
	 			this.txt=partionList[this.navs][this.ky-1].typename
	 		}
 		}
	}
</script>

<style lang="scss">
.tlt{
	padding-top: 10px;
	font-size: 14px;
	height: 35px;
	padding-left: 2%;
	.more{
		margin-right: 3%;
		font-size: 12px;
		float: right;
		display:block;
		p{
			height: 16px;
			color: #ffa726;
			vertical-align: middle;
			display: inline-block;
		}
		svg{
			fill: #ffa726;
			vertical-align: middle;
			display: inline-block;
			height: 16px;
			width: 16px;
		}
		.more-ri{
			fill: #aaa;
			height: 16px;
			width: 12px;
		}
	}
	.more-d{
		p{
			color: #aaa;
		}
	}
}
</style>